<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>拖动一个元素</title>
  <style>
    .box{
      width: 150px;
      height: 150px;
      background: blueviolet;
    }
  </style>
</head>
<body>
  <div class="box"></div>
  <script>
    /* 拖动 */
    var box = document.querySelector('.box');
    var isPressed = false;
    box.onmousedown = function () {
      isPressed = true;
      this.style.cursor = 'move';
    };
    box.onmouseup = function () {
      isPressed = false;
      this.style.cursor = 'default';
    };
    box.onmousemove = function () {
      if(!isPressed){
        return ;
      }

    };
  </script>
</body>
</html>